import React from 'react'
// ===================================================================== Temp
import Table from '#cpt/temp/Table'
import TableControls from '#cpt/temp/TableControls'
import Controls from '#cpt/temp/Controls'
import Delete from '#cpt/temp/Delete'
import AddEditModal from '#cpt/temp/AddEditModal'
// ===================================================================== global declare
const { $fn, $Lazy } = window
// ===================================================================== Lazy
const Title	= $Lazy.load(()=>import('#tp/title/title-small'))
// ===================================================================== component
const RuleData = [
	{ name:'<', 	value:'1'},
	{ name:'=', 	value:'2'},
	{ name:'<=', 	value:'3'},
	{ name:'>', 	value:'4'},
	{ name:'>=', 	value:'5'},
	{ name:'≠', 	value:'6'},
	{ name:'包含', 	value:'7'},
	{ name:'等于', 	value:'8'},
]
class Index extends React.Component{
	state = {
		data:[],
		pag: {},
		selectedKeys:[],
		// 提交表单列表
		formData : [
			{ label: '键',		name: 'absurd_key', 			half:true, required:true },
			{ label: '条件',		name: 'absurd_condition', 		half:true, required:true, type:'select', data:[{name:'必须', value:'1'},{name:'非必须', value:'0'}] },
			{ label: '规则',		name: 'absurd_rule', 			half:true, required:true, type:'select',data:RuleData },
			{ label: '值',		name: 'absurd_value', 			half:true, required:true },
			{ label: '状态',		name: 'enabled', 				half:true, type:'select', data:[{name:'启用', value:'1'},{name:'未启用', value:'0'}] },
			{ label: '排序',		name: 'sort', 					half:true, type:'number' },
			{ label: '说明',		name: 'absurd_description', 	full:true, type:'textarea' },
			
		],
	}
	
	model = {}
	
	componentDidMount(){
	}
	
	// paging
	fetch = () => $fn.fetch.call(this,'lis-absurd-data-config/index')
	
	// 关联表单
	cols = [
		{ title: '键',		dataIndex: 'absurd_key', 			width:100 },
		{ title: '规则',		dataIndex: 'absurd_rule', 			width:100, render:text=>$fn.getState(RuleData,text)},
		{ title: '值',		dataIndex: 'absurd_value', 			width:80 },
		{ title: '条件',		dataIndex: 'absurd_condition', 		width:100, render: text => +text === 1 ? '必须' : '非必须' },
		{ title: '说明',		dataIndex: 'absurd_description', 	width:100 },
		{ title: '状态',		dataIndex: 'enabled', 				...$fn.table.status, render: text => +text === 1 ? '启用' : '未启用' },
		TableControls.controls.call(this)
	]
	
	// 表格操作按钮
	table_controls = (text,{ uuid }) => {
		return [
			// 编辑
			TableControls.edit.call(this, 'lis-absurd-data-config/info', { uuid } ,{
				select: this.getModalSelect
			})
		]
	}
	// 操作按钮
	controls = () => {
		return [
			Controls.add.call(this),			// 添加
			this.onDel(),						// 删除
		]
	}
	// 删除
	onDel = uuid => Delete.call(this, 'lis-absurd-data-config/del', { uuid, isKeys: !uuid })
	
	render(){
		return (
			<>
				{/* 表格 */}
				<div className='fv ex'>
					<Title title='列表明细' controls={this.controls()} />
					{ Table.call(this, {type:1, wrapClassName:' '}) }
				</div>
				{/* 添加、编辑 */}
				{ AddEditModal.call(this,{ title:'项目列表', labelWidth:'s4', api: 'lis-absurd-data-config/add', editApi:'lis-absurd-data-config/edit'  }) }
			</>
		)
	}
}

export default Index